<template>
  <div class="login-page-container">
    <div class="login-page-content">
      <div class="pad-btm">
        <h2>易科设备库</h2>
      </div>
      <LoginForm @success="pushRouter"></LoginForm>
    </div>
	  <div class="mouse-click-area" @click="handleClick"></div>
	  <div v-if="showUpgrade" class="data-upgrade-container">
		  <el-input v-model="adminUserId" placeholder="请输入管理员用户ID" class="mar-rgt-10"></el-input>
		  <el-input-number v-model="upgradeStep" placeholder="请填写升级步骤" class="width-100"></el-input-number>
		  <el-button type="primary" class="mar-lft-10" @click="clickUpgradeBtn">数据升级</el-button>
	  </div>
  </div>
</template>

<script>
  import {routerMeta} from "@/router/routerMeta";
  import LoginForm from "@/components/LoginForm";
  import {confirmHandle, messageHandle} from "@/utils";

  export default {
    name: "Login",
    components: {
      LoginForm
    },
    data() {
      return {
				clickCount: 0,
	      lastClickTime: 0,
	      showUpgrade: false,
	      adminUserId: '',
	      upgradeStep: -1,
      }
    },
    methods: {
      pushRouter() {
        const routerPath = sessionStorage.getItem('routerPath')
        if (routerPath) {
          this.$router.push(routerPath);
        } else {
          this.$router.push(routerMeta.project.path);
        }
      },
	    handleClick() {
				if (this.showUpgrade) return;
		    const currentTime = Date.now();
		    const timeSinceLastClick = currentTime - this.lastClickTime;
		    this.lastClickTime = currentTime;

		    if (timeSinceLastClick < 500) { // 设置点击间隔的最大时间（单位：毫秒）
			    this.clickCount++;
		    } else {
			    this.clickCount = 1;
		    }

		    if (this.clickCount === 10) {
			    console.log('连续点击10次');
			    // 执行你希望的操作
			    this.clickCount = 0; // 重置点击次数
			    this.showUpgrade = true;
		    }
	    },
	    clickUpgradeBtn() {
				if (!this.adminUserId) return;
		    confirmHandle({label: `确定要进行数据升级吗?`}).then(() => {
			    API.user.upgrade({userId: this.adminUserId, step: this.upgradeStep}).then(result => {
				    messageHandle({type: 'success', msg: '数据升级成功！'});
			    });
		    }).catch(() => {
		    });
	    }
    }
  }
</script>

<style scoped lang="less">

  .login-page-container {
    background-color: #ecf0f5;
    text-align: center;
    position: relative;
    width: 100vw;
    height: 100vh;

    .login-page-content {
      position: absolute;
      width: 400px;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -70%);
    }

	  .mouse-click-area {
		  position: fixed;
		  bottom: 0;
		  right: 0;
		  width: 560px;
		  height: 60px;
	  }

	  .data-upgrade-container {
		  position: absolute;
		  bottom: 10px;
		  right: 10px;
		  display: flex;
		  justify-content: start;
	  }
  }

</style>
